{include file="header/index" /}
<div class="container whitebg agreement">
			<form class="form-inline mt15 mb15">
				<div class="form-group">
					<input type="text" id="contract_no" class="form-control input-min" placeholder="请输入合同编号">
				</div>
				<div class="form-group">
					<input type="text" id="username" class="form-control input-min" placeholder="请输入户名">
				</div>
				<div class="form-group">
					<input type="text" id="telphone" class="form-control input-min" placeholder="请输入联系电话">
				</div>
				<div class="form-group">
					<input type="text" id="id_card" class="form-control input-max" placeholder="请输入身份证号">
				</div>
				<div class="form-group">
					<input type="text" id="address" class="form-control input-max" placeholder="请输入服务地址">
				</div>
				<button type="button" id="search" class="btn btn-default input-Btn">搜索</button>
				<button type="button" onclick="window.location.href='{:url("Contractinfo/addContract")}'" data-toggle="modal" data-target="#add_contract" class="btn btn-primary fr add_contract input-Btn"><i class="glyphicon glyphicon-plus"></i>&nbsp;&nbsp;新增合同</button>
			</form>

			<form id="form1"  method="Post">
				<table class="table table-bordered">
				<thead class="thBg">
					<tr>
						<th>合同编号</th>
						<th>户名</th>
						<th>公司名称</th>
						<th>身份证号</th>
						<th>装机时间</th>
						<th>是否升级</th>
						<th>换芯时间</th>
						<th>服务费用</th>
						<th>续费周期（年）</th>
						<th>设备数</th>
						<th>换芯周期（月）</th>
						<th>操作</th>
					</tr>
				</thead>
				<script id="list-template" type="text/html">
					{{# for(var i=0;i<d.length;i++){  }}
						{{#
							if(d[i].is_Expire == 1){
						}}
								<tr class="danger">
						{{#
							}else if(d[i].is_Core == 1){
						}}
								<tr class="warning">
						{{#
							}else{
						}}
								<tr>
						{{#
							}
						}}
						<td>{{d[i].contract_no}}</td>
						<td>{{d[i].username}}</td>
						<td>{{# if(d[i].corporate_name==null||d[i].corporate_name==''){ }}
								
							{{# }else{ }}
								{{d[i].corporate_name}}
							{{# } }}
						</td>
						<td>{{d[i].id_card}}</td>
						<td>{{d[i].installed_time}}</td>
						<td>{{d[i].contract_type}}</td>
						<td>{{d[i].for_core_time}}</td>
						<td>￥{{d[i].for_core_cost}}元</td>
						<td>{{d[i].renew_date}}</td>
						<td>{{d[i].EquipmentNumber}}</td>
						<td>{{d[i].for_core_cycle}}</td>
						<td>
							<a href="{:url('Contractinfo/details')}?contract_id={{d[i].contract_id}}">查看</a>
							<a href="{:url('Contractinfo/editContract')}?contract_id={{d[i].contract_id}}">修改</a>
							<!--<a href="#">增加合同</a>-->
						</td>
					</tr>
					{{# } }}
				</script>
					<tbody id="list-content"></tbody>
			</table>
			</form>
			<span><i style="width: 12px;background: #f2dede">&nbsp;&nbsp;&nbsp;&nbsp;</i>：合同到期</span>
			<span><i style="width: 12px;background: #fcf8e3">&nbsp;&nbsp;&nbsp;&nbsp;</i>：换芯到期</span>
            <!--<button type="button" onclick="window.location.href='{:url("Contractinfo/export")}'" class="btn btn-primary input-Btn" style="margin-left:10px">导出所有合同</button>-->
            <button type="button" onclick="export1()" class="btn btn-primary input-Btn" style="margin-left:10px">导出合同</button>
			<div class="clearfix" style="float:right;margin: 0 auto;">
				<span class="fl mt5" id="count">共{$count}条数据</span><span id="allpage"  class="fl  mr20 mt5"></span><span  class="fl" id="AjaxPage"></span>
			</div>
			<!-- 加载动画 -->
			<div class="spiner-example">
				<div class="sk-spinner sk-spinner-three-bounce">
					<div class="sk-bounce1"></div>
					<div class="sk-bounce2"></div>
					<div class="sk-bounce3"></div>
				</div>
			</div>
		</div>
	<input type="hidden" id="hidden_id_card" value="">
	<input type="hidden" id="hidden_contract_no" value="">
	<input type="hidden" id="hidden_username" value="">
	<input type="hidden" id="hidden_address" value="">
	<input type="hidden" id="hidden_telphone" value="">

<div id="dc">
	<div class="dcinner">
		<div class="choosedate mr5">
			<input class="form-control" type="text" placeholder="开始时间" id="datetimeStart1" value=""  class="form_datetime">
		</div>
		<div class="choosedate mr20">
			<input class="form-control" type="text" placeholder="结束时间"  id="datetimeEnd1"  value=""  class="form_datetime">
		</div>
	</div>
	<div class="dcbtn">
		<button type="button" onclick="export2()" class="btn btn-primary input-Btn">导出</button>
		<span class="note">注：当导出数据量过多时，可能造成导出失败。</span>
	</div>
</div>
</body>
<style>
	.note{
		color: red;
	}
	#dc{
		display: none;
		padding: 20px;
	}
	.dcinner{
		display: flex;
		align-items: center;
		justify-content: space-around;
	}
	.dcbtn{
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-top: 15%;
	}
	.dcbtn button{
		margin-bottom: 10%;
	}
	.datetimepicker{
		z-index: 999999 !important;
	}
	.layui-layer-shade{
		z-index: 999 !important;
	}
	.layui-layer{
		z-index: 9999 !important;
	}
</style>
</html>
<script type="text/javascript">
    $("#datetimeStart1").datetimepicker({
        language: 'cn',
        format: "yyyy-mm-dd",
        autoclose: true,
        minView: "month",
        maxView: "decade",
        todayBtn: true,
        pickerPosition: "bottom-left"
    }).on("click", function(ev) {
        console.log(222);
        $("#datetimeStart1").datetimepicker("setEndDate", $("#datetimeEnd1").val());
    });



    $("#datetimeEnd1").datetimepicker({
        language: 'cn',
        format: "yyyy-mm-dd",
        autoclose: true,
        minView: "month",
        maxView: "decade",
        todayBtn: true,
        pickerPosition: "bottom-left"
    }).on("click", function(ev) {
        $("#datetimeEnd1").datetimepicker("setStartDate", $("#datetimeStart1").val());
    });

	function export1(){
        //页面层
        layer.open({
            type: 1,
            skin: 'layui-layer-demo', //样式类名
            closeBtn: 0, //不显示关闭按钮
            anim: 2,
            title:"导出选择",
            area: ['500px', '300px'],
            shadeClose: true, //开启遮罩关闭
            content: $('#dc')
            // content: '' +
			// '<div style="margin: 60px auto 0px auto;text-align: center;">' +
			// 	'<button style="margin:0px 5px" type="button" onclick="export2(\'{:url("Contractinfo/export")}?type_=1\')" class="btn btn-primary input-Btn">今天</button>' +
			// 	'<button style="margin:0px 5px" type="button" onclick="export2(\'{:url("Contractinfo/export")}?type_=2\')"" class="btn btn-primary input-Btn">一周</button>' +
			// 	'<button style="margin:0px 5px"  type="button" onclick="export2(\'{:url("Contractinfo/export")}?type_=3\')"" class="btn btn-primary input-Btn">一个月</button>' +
			// 	'<button style="margin:0px 5px"  type="button" onclick="export2(\'{:url("Contractinfo/export")}?type_=4\')"" class="btn btn-primary input-Btn">三个月</button>' +
			// 	'<button style="margin:0px 5px" type="button" onclick="export2(\'{:url("Contractinfo/export")}?type_=5\')"" class="btn btn-primary input-Btn">全部</button>' +
			// '</div>' +
			// '<p style="text-align: center;margin-top: 10px;">注：按安装时间导出，数据太多可能会失败。</p>'
        });
	};

    function export2() {
        var start_time = $("#datetimeStart1").val();
        var end_time = $("#datetimeEnd1").val();

        if (start_time == ''){
            top.layer.msg('请选择开始时间', {icon: 2});
            return false;
        }
        if (end_time == ''){
            top.layer.msg('请选择结束时间', {icon: 2});
            return false;
        }
        var index = layer.load(1, {
            shade: [0.1,'#fff'] //0.1透明度的白色背景
        });
        setTimeout(function () {
            layer.close(index);
        },3000);
        window.location.href = "{:url('Contractinfo/export')}?start_time=" + start_time +'&end_time='+end_time;
    }





    Ajaxpage();
    function Ajaxpage(curr){
        var address = $('#hidden_address').val();
		var id_card = $('#hidden_id_card').val();
        var contract_no = $('#hidden_contract_no').val();
        var username = $('#hidden_username').val();
        var telphone = $('#hidden_telphone').val();
        $.getJSON('{:url("Contractinfo/index")}', {page: curr || 1,telphone:telphone,address:address,contract_no:contract_no,username:username,id_card:id_card}, function(data){
            console.log(data.data);
            $(".spiner-example").css('display','none'); //数据加载完关闭动画
            if(data.data==''){
                $("#list-content").html('<td colspan="20" style="padding-top:10px;padding-bottom:10px;font-size:16px;text-align:center">暂无数据</td>');
                $('#count').html("共"+data.page.count+"条数据");
                $("#allpage").css('display','none');
                $("#AjaxPage").css('display','none');
            }else{
                var tpl = document.getElementById('list-template').innerHTML;
                laytpl(tpl).render(data.data, function(html){
                    document.getElementById('list-content').innerHTML = html;
                    $('#count').html("共"+data.page.count+"条数据");
                    $("#allpage").css('display','');
                    $("#AjaxPage").css('display','');
                });
                laypage({
                    cont: $('#AjaxPage'),//容器。值支持id名、原生dom对象，jquery对象,
                    pages:data.page.lastPage,//总页数
                    skip: true,//是否开启跳页
                    skin: '#337ab7',//分页组件颜色
                    curr: curr || 1,
                    first: '首页', //若不显示，设置false即可
                    last: '尾页', //若不显示，设置false即可
                    groups: 3,//连续显示分页数
                    jump: function(obj, first){
                        if(!first){
                            Ajaxpage(obj.curr)
                        }
                        $('#allpage').html('，第' + obj.curr + '页，共' + '<i>' + obj.pages + '</i>' + '页');
						inputlength();
                    }
                });
            }
        });
    }

    //搜索
    $('#search').click(function () {
        $("#hidden_id_card").val($("#id_card").val());
        $("#hidden_address").val($("#address").val());
        $("#hidden_contract_no").val($("#contract_no").val());
        $("#hidden_username").val($("#username").val());
        $("#hidden_telphone").val($("#telphone").val());
        Ajaxpage();
    });





</script>